<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

<html>
<head>
    <title>校园论坛 - 教育新闻网</title>
    <link href="${pageContext.request.contextPath}/static/css/bootstrap.min.css" rel="stylesheet">
    <link href="${pageContext.request.contextPath}/static/css/bootstrap-icons.css" rel="stylesheet">
    <style>
        .forum-list {
            margin: 30px 0;
        }
        .forum-item {
            padding: 20px;
            border-bottom: 1px solid #eee;
            transition: all 0.3s;
        }
        .forum-item:hover {
            background-color: #f8f9fa;
        }
        .forum-title {
            color: #333;
            font-size: 18px;
            margin-bottom: 10px;
            text-decoration: none;
        }
        .forum-title:hover {
            color: #0d6efd;
        }
        .forum-meta {
            color: #666;
            font-size: 14px;
        }
        .forum-meta span {
            margin-right: 20px;
        }
        .pagination {
            margin-top: 30px;
            justify-content: center;
        }
        #addPostModal .modal-body {
            padding: 20px;
        }
        .empty-state {
            text-align: center;
            padding: 60px 0;
            color: #6c757d;
        }
        .empty-state h4 {
            margin-bottom: 15px;
            color: #343a40;
        }
        .empty-state p {
            margin-bottom: 20px;
            font-size: 16px;
        }
        .forum-notice {
            background-color: #f8f9fa;
            border-left: 4px solid #0d6efd;
            padding: 15px 20px;
            margin-bottom: 20px;
            border-radius: 4px;
        }
        .forum-notice h5 {
            color: #0d6efd;
            margin-bottom: 10px;
        }
        .forum-notice ul {
            margin-bottom: 0;
            padding-left: 20px;
        }
        .forum-notice li {
            margin-bottom: 5px;
            color: #666;
        }
        .forum-stats {
            background: #fff;
            padding: 10px 15px;
            border-radius: 4px;
            box-shadow: 0 1px 3px rgba(0,0,0,0.1);
            display: inline-flex;
            align-items: center;
            gap: 10px;
        }
        .forum-stats i {
            color: #0d6efd;
        }
    </style>
</head>
<body>
    <!-- 引入头部 -->
    <jsp:include page="/user/common/header.jsp"/>
    
    <div class="container">
        <div class="d-flex justify-content-between align-items-center mb-4">
            <div>
                <h3 class="mb-2">校园论坛</h3>
                <div class="forum-stats">
                    <i class="bi bi-chat-dots"></i>
                    <span>共有 ${empty totalCount ? '0' : totalCount} 篇帖子</span>
                </div>
            </div>
            <button class="btn btn-primary" onclick="showAddPostModal()">
                <i class="bi bi-plus-lg"></i> 发布帖子
            </button>
        </div>

        <!-- 发帖注意事项 -->
        <div class="forum-notice">
            <h5><i class="bi bi-info-circle"></i> 发帖注意事项</h5>
            <ul>
                <li>请确保发帖内容真实、有效，不得发布虚假或误导性信息</li>
                <li>严禁发布违法、违规、色情、暴力等不良信息</li>
                <li>请文明用语，互相尊重，共同维护良好的论坛氛围</li>
                <li>发帖前请先搜索是否有相似主题，避免重复发帖</li>
            </ul>
        </div>
        
        <div class="forum-list">
            <c:choose>
                <c:when test="${empty postList}">
                    <div class="empty-state">
                        <h4>暂无论坛信息</h4>
                        <p>来发布第一个帖子吧！</p>
                        <button class="btn btn-primary" onclick="showAddPostModal()">
                            <i class="bi bi-plus-lg"></i> 发布帖子
                        </button>
                    </div>
                </c:when>
                <c:otherwise>
                    <c:forEach items="${postList}" var="post">
                        <div class="forum-item">
                            <a href="${pageContext.request.contextPath}/user/forum/detail?id=${post.post_id}" class="forum-title">
                                ${post.title}
                            </a>
                            <div class="forum-meta">
                                <span><i class="bi bi-person"></i> ${post.username}</span>
                                <span><i class="bi bi-eye"></i> ${post.view_count}次浏览</span>
                                <span><i class="bi bi-clock"></i> <fmt:formatDate value="${post.create_time}" pattern="yyyy-MM-dd HH:mm"/></span>
                            </div>
                        </div>
                    </c:forEach>
                </c:otherwise>
            </c:choose>
        </div>
        
        <!-- 分页 -->
        <c:if test="${not empty postList and totalPages > 1}">
            <nav>
                <ul class="pagination">
                    <li class="page-item ${currentPage == 1 ? 'disabled' : ''}">
                        <a class="page-link" href="${pageContext.request.contextPath}/user/forum?page=${currentPage - 1}">上一页</a>
                    </li>
                    
                    <c:forEach begin="1" end="${totalPages}" var="i">
                        <li class="page-item ${currentPage == i ? 'active' : ''}">
                            <a class="page-link" href="${pageContext.request.contextPath}/user/forum?page=${i}">${i}</a>
                        </li>
                    </c:forEach>
                    
                    <li class="page-item ${currentPage == totalPages ? 'disabled' : ''}">
                        <a class="page-link" href="${pageContext.request.contextPath}/user/forum?page=${currentPage + 1}">下一页</a>
                    </li>
                </ul>
            </nav>
        </c:if>
    </div>
    
    <!-- 发布帖子模态框 -->
    <div class="modal fade" id="addPostModal" tabindex="-1">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title">发布帖子</h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <form id="addPostForm">
                        <div class="mb-3">
                            <label class="form-label">标题</label>
                            <input type="text" class="form-control" name="title" required>
                        </div>
                        <div class="mb-3">
                            <label class="form-label">内容</label>
                            <textarea class="form-control" name="content" rows="5" required></textarea>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">取消</button>
                    <button type="button" class="btn btn-primary" onclick="submitPost()">发布</button>
                </div>
            </div>
        </div>
    </div>
    
    <!-- 引入底部 -->
    <jsp:include page="/user/common/footer.jsp"/>
    
    <script src="${pageContext.request.contextPath}/static/js/bootstrap.bundle.min.js"></script>
    <script>
        let addPostModal;
        
        // 页面加载完成后初始化模态框
        document.addEventListener('DOMContentLoaded', function() {
            addPostModal = new bootstrap.Modal(document.getElementById('addPostModal'));
        });
        
        // 显示发布帖子模态框
        function showAddPostModal() {
            <c:choose>
                <c:when test="${empty sessionScope.user}">
                    alert('请先登录后再发布帖子');
                    window.location.href = '${pageContext.request.contextPath}/user/login.jsp';
                </c:when>
                <c:otherwise>
                    addPostModal.show();
                </c:otherwise>
            </c:choose>
        }
        
        // 提交帖子
        function submitPost() {
            const form = document.getElementById('addPostForm');
            const formData = new FormData(form);
            
            fetch('${pageContext.request.contextPath}/user/forum/add', {
                method: 'POST',
                body: new URLSearchParams(formData)
            })
            .then(response => response.json())
            .then(data => {
                if (data.success) {
                    alert(data.message);
                    window.location.reload();
                } else {
                    alert(data.message);
                }
            })
            .catch(error => {
                console.error('Error:', error);
                alert('发布失败，请稍后重试');
            });
        }
    </script>
</body>
</html> 